<template>
	<view class="temEmail">
		<template v-for="(item,index) in list ">
			<view class="box" :key="item.msgId" @click="toDetail(item,index)">
				<text class="box_dot" v-if="item.isRead == 1 ? false : true"></text>
				<view class="box_top">
					<view class="box_top_left  f16">{{item.fromStr }}</view>
					<view class="box_top_right"><text class="f12">{{item.isRead == 1 ? '已读' : '未读'}}</text></view>
				</view>
				<view class="box_bot" v-if="item.type == 'reSume'">点击查看简历详情</view>
				<view class="box_bot" v-else>{{item.msg}}</view>
			</view>
		</template>
		<notFoundData v-if="list.length == 0 ? true : false" />
	</view>
</template>

<script>
	import notFoundData from '@/components/notFoundData/index.vue'
	export default {
		components: {
			notFoundData
		},
		data() {
			return {
				list: []
			}
		},
		methods: {
			reloadReadIsList(result) {
				let newList = []
				result.map(item => {
					let newItem = {
						...item.msg,
						createDate: this.$timestampToTime(item.createDate)
					}
					if (item.msg.isRead == 0) {
						//未读
						newList.unshift(newItem)
					} else {
						newList.push(newItem)
					}
				})
				return newList

			},
			temEmailMsgSend() {
				this.$eventBus.$emit('temEmailMsgSend', this.currentItem, this.index)
			},
			toDetail(item, index) {
				this.currentItem = item
				this.index = index
				uni.navigateTo({
					url: '/pages/organizeTeam/src/emailDetail',
					success: () => {
						this.$set(this.list, this.index, {
							...this.list[this.index],
							isRead: 1
						})
					}
				});
			}
		},
		async created() {
			this.$eventBus.$on('temEmailMsg', () => {
				this.temEmailMsgSend()
			})
			try {
				const result = await this.$mjcrequest.request({
					url: this.$api.GetMsg,
					header: this.$aplsjsonheader,
					method: 'GET'
				});

				if (result.length != 0) {
					//无消息
					this.list = this.reloadReadIsList(result)
					// this.list = result
					console.log(this.list);
				}
			} catch (e) {
				this.$errMessageToast(e)
				//TODO handle the exception
			}
		},
		destroyed() {
			this.$eventBus.$off('temEmailMsg')
		}
	}
</script>

<style lang="less" scoped>
	.temEmail {
		padding: 15rpx;
		background-color: #fdfdfd;

		.mainBox {
			display: flex;
			justify-content: center;
		}


		.box {
			position: relative;
			margin: 10px 0;

			&_dot {
				position: absolute;
				width: 8px;
				height: 8px;
				border-radius: 50%;
				overflow: hidden;
				background-color: red;
				top: 0;
				right: 0;
			}

			&_top {
				display: flex;
				border-bottom: 1px #DCDCDC solid;
				flex-direction: row;
				align-items: center;
				padding: 10px;
				overflow: hidden;

				&_left {
					display: flex;
					flex: 1;
					flex-direction: row;
					align-items: center;
					overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
					overflow: hidden;
				}

				&_right {
					line-height: 12px;
				}
			}

			&_bot {
				padding: 10px;
				font-size: 14px;
				color: #6a6a6a;
				line-height: 22px;
				white-space: nowrap;
				text-overflow: ellipsis;
				overflow: hidden;
			}


			padding: 0 10px;
			box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.08);
			border: 1px solid #DCDCDC;
			border-radius: 4px;
			overflow: hidden;
			background-color: #fff;
			font-family: Helvetica Neue,
			Helvetica,
			PingFang SC,
			Hiragino Sans GB,
			Microsoft YaHei,
			SimSun,
			sans-serif;
		}
	}
</style>
